import { formatMoney } from '@src/assets/js/tool';
import { CaseSchema } from '@src/components/schema/caseSchema';
import { useEffect, useState } from 'react';
import style from './index.module.less'

interface Props {
  data: CaseSchema | {[k: string]: any}
}

function Main ({ data }: Props) {
  const [arbitrators, setArbitrators] = useState('')
  useEffect(() => {
    if (data) {
      const s: string[] = []
      if (data.arbitrator) { s.push(data.arbitrator) }
      if (data.arbitrator1) { s.push(data.arbitrator1) }
      if (data.arbitrator2) { s.push(data.arbitrator2) }
      setArbitrators(s.join())
    }
  }, [data])
  if (!data) {
    return <span />
  }
  return (
    <div className={style.container}>
      <div className={style.line}>
        <span className={style.label}>受理秘书</span>
        <span className={style.split}></span>
        <span className={style.value}>{data.accepter || '无'}</span>
      </div>
      <div className={style.line}>
        <span className={style.label}>办理秘书</span>
        <span className={style.split}></span>
        <span className={style.value}>{data.processer || '无'}</span>
      </div>
      <div className={style.line}>
        <span className={style.label}>仲裁员</span>
        <span className={style.split}></span>
        <span className={style.value}>{arbitrators || '无'}</span>
      </div>
      <div className={style.line}>
        <span className={style.label}>仲裁费</span>
        <span className={style.split}></span>
        <span className={style.value}>{formatMoney(data.fee) || 0}元</span>
      </div>
      <div className={style.line}>
        <span className={style.label}>标的</span>
        <span className={style.split}></span>
        <span className={style.value}>{formatMoney(data.dispute_amount) || 0}元</span>
      </div>
    </div>
  )
}

export default Main
